import React from 'react';
import { observer } from 'mobx-react';
import window from '../../util';
import { WeaLocaleProvider } from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;

export interface ReplyItemDetailProps {
    floornum?: string;
    id: string;
    rattach: string;
    replycontent: string;
    replydate: string;
    replytime: string;
    replyor: string;
    rproject: string;
    rworkflow: string;
    rcustomer: string;
    rdocument: string;
    replyorname: string;
    showType?:any;
}
export interface ReplyItemDetailWrapProps {
    quotes?: ReplyItemDetailProps;
    comments?: ReplyItemDetailProps[];
    showType?:any;
}
@observer
export class Quotes extends React.Component<ReplyItemDetailProps, any> {
    render() {
        const { replycontent, floornum, replydate, replytime, replyorname, rdocument, rworkflow, rcustomer, rproject,showType } = this.props;
        return (
            <div className="content-right-quotes">
                <div className='content-right-other-html'>
                    {showType&&showType=='2'?
                        <div>{getLabel(19422,'引用')+' #'+floornum } <span title={getLabel('131681', "发表于") + ":" + `${replydate} ${replytime}`}>{replyorname}</span></div>
                        :
                        ` ${getLabel(19422,'引用')+' #'+floornum} ${replyorname} ${replydate} ${replytime}`
                    }
                 
                </div>
                <div className='content-right-remark-html' dangerouslySetInnerHTML={{ __html: replycontent }} />
                {rdocument &&
                    <div className='content-right-other-html'>
                        {getLabel(857,'相关文档') +':'}	{rdocument}
                    </div>
                }
                {rworkflow &&
                    <div className='content-right-other-html'>
                        {getLabel(1044,'相关流程')+": "}	{rworkflow}
                    </div>
                }
                {rcustomer &&
                    <div className='content-right-other-html'>
                        {getLabel(783,'相关客户')+": "}	{rcustomer}
                    </div>
                }
                {rproject &&
                    <div className='content-right-other-html'>
                        {getLabel(782,'相关项目')+": "}	${rproject}
                    </div>
                }
            </div>
        )
    }
}

@observer
export class Comments extends React.Component<ReplyItemDetailProps, any> {
    render() {
        const { replycontent, replydate, replytime, rdocument, rworkflow, rcustomer, rproject, replyor, replyorname } = this.props;
        return (
            <div className="content-right-comments">
                <div className='content-right-other-html'>
                    <a style={{ paddingRight: 10, color: '#929393' }} href={`javaScript:openhrm(${replyor})`} onClick={event => window.pointerXY(event)}>{replyorname}</a> {`${replydate} ${replytime}`}
                </div>
                <div className='content-right-remark-html' dangerouslySetInnerHTML={{ __html: replycontent }} />

                {rdocument &&
                    <div className='content-right-other-html'>
                        {getLabel(857,'相关文档') +':'}	{rdocument}
                    </div>
                }
                {rworkflow &&
                    <div className='content-right-other-html'>
                         {getLabel(1044,'相关流程')+": "}	{rworkflow}
                    </div>
                }
                {rcustomer &&
                    <div className='content-right-other-html'>
                         {getLabel(783,'相关客户')+": "}	{rcustomer}
                    </div>
                }
                {rproject &&
                    <div className='content-right-other-html'>
                        {getLabel(782,'相关项目')+": "}	${rproject}
                    </div>
                }
            </div>
        )
    }
}

@observer
export default class ReplyItemDetail extends React.Component<ReplyItemDetailWrapProps, any> {
    render() {
        if (this.props.quotes) {
            return (
                <Quotes {...this.props.quotes} showType={this.props.showType?this.props.showType:'1'} />
            )
        }
        if (this.props.comments) {
            return (
                this.props.comments.map(d => (<Comments {...d} />))

            )
        }
        return (
            null
        )
    }
}

